<template>
  <div>
  <el-dialog
    :title="!dataForm.populationCoding ? $t('handle.add') : btnshow ? '修改':'详情'"
    :close-on-click-modal="false"
    :visible.sync="visible">
    <div v-loading = loading>
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="基本信息" name="first">
        <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="100px">
          <el-row>
            <el-col :span="12">
              <el-form-item label="认证类型" style="height:50px;">
                <el-select style="width:100%" @change="authenticationChange" :disabled="isInput"  v-model="peopleForm.relatioTypeId" filterable placeholder="请选择">
                  <el-option
                    v-for="item in authenticationTypes"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              <el-button type="primary" :disabled="isAuthentication" round @click="readIdcardCustody()" style="margin-left:50px;margin-top:20px;width:150px;">监护人人证合一</el-button>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="监护人姓名" :prop="relationName">
                <el-input v-model="dataForm.relationName" :disabled="true" placeholder="监护人姓名"></el-input>
              </el-form-item>
              <el-form-item label="监护身份证" :prop="relationIdentityNumber">
                <el-input v-model="dataForm.relationIdentityNumber" :disabled="true" placeholder="监护人身份证号"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
          <el-form-item label="证件照片" style="height:220px;">
          <el-upload
            class=""
            action="/clientauth/client/upload"
            :show-file-list="false"
            :on-success="handleSucess"
            :before-upload="beforeAvatarUpload"
            :disabled="true"
            :headers="headers"
            style="margin-left:50px;">
            <img v-if="imageUrl" :src="imageUrl" class="avatar" style="width:150px;height:180px;">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
            <el-button type="primary" :disabled="isAuthenticationOwen" round @click="readIdcard()" style="margin-top:5px;width:150px;">本人人证合一认证</el-button>
          </el-upload>
          </el-form-item>
            </el-col>
                <el-col :span="12">
                  <el-form-item :label="$t('form.name')" prop="name" style="margin-top:5px;">
                    <el-input v-model="dataForm.name" :disabled="isAuthentication" placeholder="姓名"></el-input>
                  </el-form-item>
                  <el-form-item :label="$t('form.sex')" prop="sex" style="margin-top:3px;">
                    <el-select v-model="dataForm.sex" :disabled="isAuthentication"  placeholder="请选择" style="width:100%">
                    <el-option
                      v-for="item in sexOptions"
                      :key="item.id"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                  </el-form-item>
                  <el-form-item label="民族" prop="nation" style="margin-top:3px;">
                    <el-select v-model="dataForm.nation" :disabled="isAuthentication" filterable  placeholder="请选择" style="width:100%">
                    <el-option
                      v-for="item in nationOptions"
                      :key="item.id"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                  </el-form-item>
                  <!-- <el-form-item label="身份证号" prop="identityNumber">
                    <el-input v-model="dataForm.identityNumber" :disabled="true" placeholder="身份证号"></el-input>
                  </el-form-item> -->
                   <el-form-item :label="$t('form.birthDate')" prop="birthdate">
                    <el-input v-model="dataForm.birthdate" :disabled="isAuthentication" placeholder="出生日期，1996-01-08"></el-input>
                  </el-form-item>
                </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
            <el-form-item label="证件种类" prop="identificationType">
              <el-select v-model="dataForm.identificationType" filterable :disabled="isAuthentication"  placeholder="请选择" style="width:100%">
              <el-option
                v-for="item in zjlxOptions"
                :key="item.id"
                :label="item.label"
                :value="item.value"
                :disabled="item.disabled">
              </el-option>
            </el-select>
            </el-form-item>
            </el-col>
                <el-col :span="12">
            <el-form-item label="证件号" prop="identificationNumber">
              <el-input v-model="dataForm.identificationNumber" :disabled="isAuthentication" placeholder="证件号码"  ></el-input>
            </el-form-item>
            </el-col>
          </el-row>
          <!-- <el-row>
            <el-col :span="12">
              <el-form-item label="房屋"  prop="addressName" v-show="false">
                <el-input :disabled="true" v-model="houseAndPopulation.addressName" placeholder="实有房屋" style="width:80%"></el-input><el-button type="info" plain :disabled="isInput"  @click="buttonHouseHandle()">选择</el-button>
              </el-form-item>
            </el-col>
              <el-col :span="12">
                <el-form-item label="关系"  prop="type" v-show="false">
                  <el-select v-model="dataForm.type" :disabled="isInput" placeholder="请选择" style="width:100%">
                    <el-option
                      v-for="item in options"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                </el-select>
                </el-form-item>
              </el-col>
          </el-row> -->
          <el-form-item label="户籍地址" prop="addressText">
            <el-input v-model="dataForm.addressText" placeholder="户籍地址" :disabled="true" style="width:90%"></el-input><el-button style="width:10%" type="info" :disabled="isInput" plain @click="addressDialogOpen()">选择</el-button>
          </el-form-item>
          <el-row>
              <el-col :span="12">
                <el-form-item label="单位"  prop="unitIdText">
                  <el-input :disabled="true" v-model="dataForm.unitIdText" placeholder="实有单位" style="width:80%"></el-input><el-button type="info" plain :disabled="isInput"  @click="buttonHandle()">选择</el-button>
                </el-form-item>
              </el-col>
                <el-col :span="12">
            <el-form-item label="曾用名" prop="usedName">
              <el-input v-model="dataForm.usedName" :disabled="isInput" placeholder="曾用名"></el-input>
            </el-form-item>
            </el-col>
          </el-row>
            <el-row>
              <el-col :span="12">
            <el-form-item label="外文姓"  prop="foreignSurname">
              <el-input v-model="dataForm.foreignSurname" :disabled="isInput" placeholder="外文姓"></el-input>
            </el-form-item>
            </el-col>
                <el-col :span="12">
            <el-form-item label="外文名" prop="foreignName" >
              <el-input v-model="dataForm.foreignName" :disabled="isInput" placeholder="外文名"></el-input>
            </el-form-item>
            </el-col>
          </el-row>
            <!-- <el-row>
              <el-col :span="12">
            <el-form-item :label="$t('form.sex')" prop="sex">
              <el-select v-model="dataForm.sex" :disabled="true"  placeholder="请选择" style="width:100%">
              <el-option
                v-for="item in sexOptions"
                :key="item.id"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
            </el-form-item>
            </el-col>
                <el-col :span="12">
            <el-form-item label="民族" prop="nation">
              <el-select v-model="dataForm.nation" :disabled="isInput" filterable  placeholder="请选择" style="width:100%">
              <el-option
                v-for="item in nationOptions"
                :key="item.id"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
            </el-form-item>
            </el-col>
          </el-row> -->
          <el-row>
            <el-col :span="12">
              <el-form-item label="人口类别" prop="managementCategory">
                <el-select v-model="dataForm.managementCategory" :disabled="isInput" filterable  placeholder="请选择" style="width:100%">
                  <el-option
                    v-for="item in rklbOptions"
                    :key="item.id"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
          </el-col>
              <el-col :span="12">
          <el-form-item label="注销类别" prop="logoutCategory">
            <el-select v-model="dataForm.logoutCategory" filterable :disabled="isInput"  placeholder="请选择" style="width:100%">
            <el-option
              v-for="item in rkzxlbOptions"
              :key="item.id"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
          </el-form-item>
              </el-col>
          </el-row>
          <el-row>
            <!-- <el-col :span="12"> -->
          <!-- <el-form-item
                v-for="(domain,index) in dataForm.house_populationList.domains"
                label="实有房屋"
                :key="domain.key"
                :prop="'house_populationList.domains['+index+'].addressName'"
                :rules="{
                  required: true, message: '房子不能为空', trigger: 'blur'
                }"
          > -->
            <!-- <el-input v-model="domain.addressName" placeholder="选择房屋" style="width:85%;margin-right:5px;" :disabled="true" ></el-input>
                  <el-button type="success" v-show="btnshow" icon="el-icon-check" circle @click="buttonHouseHandle(index,domain.houseId)"></el-button>
          </el-form-item> -->
            <!-- </el-col> -->
            <!-- <el-col :span="12">
               <el-form-item
                v-for="(domain,index) in dataForm.house_populationList.domains"
                label="人房关系"
                :key="domain.key"
                :prop="'house_populationList.domains['+index+'].dictValue'"
                :rules="{
                  required: true, message: '人房关系不能为空', trigger: 'blur'
                }"

          > -->
              <!-- <el-select v-model="domain.dictValue" :disabled="isInput" placeholder="请选择" style="width:70%;margin-right:5px;">
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select> -->
              <!-- <el-tooltip class="item" effect="dark" content="添加人员框" placement="top" > -->
                <!-- <el-button type="primary" v-show="btnshow" icon="el-icon-plus" @click="addDomain" circle></el-button> -->
              <!-- </el-tooltip> -->
              <!-- <el-tooltip class="item" effect="dark" content="删除人员框" placement="top"> -->
                <!-- <el-button type="danger" v-show="btnshow" icon="el-icon-minus" @click.prevent="removeDomain(domain)" circle></el-button> -->
              <!-- </el-tooltip> -->
          <!-- </el-form-item> -->
          <!-- </el-col> -->
          </el-row>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="附属信息" name="second">
        <el-form :model="peopleForm"  :rules="peopleRule" ref="peopleForm" label-width="150px">
          <el-row>
            <el-col :span="12">
               <el-form-item label="人员头像" style="height:200px;">
                <el-upload
                  class=""
                  action="/clientauth/client/upload"
                  :show-file-list="false"
                  :on-success="handleSucess"
                  :before-upload="beforeAvatarUpload"
                  :disabled="true"
                  :headers="headers"
                  style="margin-left:50px;">
                  <img v-if="popuimageUrl" :src="popuimageUrl"  @click="photoClick" class="avatar" style="width:150px;height:200px;">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>
                </el-form-item>
            </el-col>
            <el-col :span="12">
              <!-- <el-form-item label="真实姓名" prop="realName">
                <el-input v-model="peopleForm.realName" :disabled="isInput" placeholder="真实姓名"></el-input>
              </el-form-item> -->
              <el-form-item label="联系电话" prop="contactPhone">
                <el-input v-model="peopleForm.contactPhone" :disabled="isInput" placeholder="联系电话"></el-input>
              </el-form-item>
              <el-form-item label="房东姓名" prop="landlordName">
                <el-input v-model="peopleForm.landlordName" :disabled="isInput" placeholder="房东姓名"></el-input>
              </el-form-item>
               <el-form-item label="房东电话" prop="landlordPhone">
                <el-input v-model="peopleForm.landlordPhone" :disabled="isInput" placeholder="房东电话"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row v-show="false">
            <el-col :span="12">

            </el-col>
            <el-col :span="12">

            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="婚姻状况" prop="maritalStatus">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.maritalStatus" filterable placeholder="请选择">
                  <el-option
                    v-for="item in option"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="结婚日期"  prop="weddingDay">
                <el-date-picker
                 style="width: 100%;"
                 :disabled="isInput"
                  v-model="peopleForm.weddingDay"
                  type="date"
                  placeholder="选择设立日期"
                  format="yyyy-MM-dd"
                  value-format="yyyy-MM-dd">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="户口性质" prop="accountProperties">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.accountProperties" filterable placeholder="请选择">
                  <el-option
                    v-for="item in accountPropertiesOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="户籍地说明" prop="domicileAddress">
                <el-input v-model="peopleForm.domicileAddress" :disabled="isInput" placeholder="户籍地说明"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="健康状况" prop="healthCondition">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.healthCondition" filterable placeholder="请选择">
                  <el-option
                    v-for="item in healthConditionOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="文化程度" prop="educationDegree">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.educationDegree" filterable placeholder="请选择">
                  <el-option
                    v-for="item in educationDegreeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="是否独生" prop="isOnly">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.isOnly" filterable placeholder="请选择">
                  <el-option
                    v-for="item in yesOrNoOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="职业" prop="occupation">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.occupation" filterable placeholder="请选择">
                  <el-option
                    v-for="item in occupationOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="工作单位" prop="workUnit">
                <el-input v-model="peopleForm.workUnit" :disabled="isInput" placeholder="工作单位"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否同户" prop="isWithDoor">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.isWithDoor" filterable placeholder="请选择">
                  <el-option
                    v-for="item in yesOrNoOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="是否党员" prop="isPartyMember">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.isPartyMember" filterable placeholder="请选择">
                  <el-option
                    v-for="item in yesOrNoOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否低保人员" prop="isSubsistenceAllowance">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.isSubsistenceAllowance" filterable placeholder="请选择">
                  <el-option
                    v-for="item in yesOrNoOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="是否重点人群" prop="isFocusGroups">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.isFocusGroups" filterable placeholder="请选择">
                  <el-option
                    v-for="item in yesOrNoOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否缴纳养老保险" prop="isEndowmentInsurance">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.isEndowmentInsurance" filterable placeholder="请选择">
                  <el-option
                    v-for="item in yesOrNoOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="残疾类型" prop="disabilityType">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.disabilityType" filterable placeholder="请选择">
                  <el-option
                    v-for="item in disabilityTypeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="残疾证号" prop="disabilityNumber">
                <el-input v-model="peopleForm.disabilityNumber" :disabled="isInput" placeholder="残疾证号"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="是否现服兵役" prop="isNowMilitaryService">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.isNowMilitaryService" filterable placeholder="请选择">
                  <el-option
                    v-for="item in yesOrNoOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否空巢老人" prop="isEmptyNest">
                <el-select style="width: 100%;" :disabled="isInput" v-model="peopleForm.isEmptyNest" filterable placeholder="请选择">
                  <el-option
                    v-for="item in yesOrNoOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-tab-pane>
    </el-tabs>
    <div style="text-align:right;">
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">{{ $t('handle.cancel') }}</el-button>
      <el-button type="primary" v-show="btnshow" @click="dataFormSubmit()">{{ $t('handle.confirm') }}</el-button>
    </span>
    </div>
    </div>
  </el-dialog>
  <actuaunit-Dialog v-if="addOrUpdateVisible" ref="actuaunitDialog" @receiveParameters="getParameters"></actuaunit-Dialog>
  <house-Dialog v-if="houseVisible" ref="houseDialog" @receiveParameters="getHouseParameters"></house-Dialog>
   <id-card-verify v-if="true" ref="idCardVerify" @verifyResult="idCardRead"></id-card-verify>
   <id-card-verify-custody v-if="true" ref="idCardVerifyCustody" @verifyResult="idCardReadCustody"></id-card-verify-custody>
   <photo-dialog v-if="true" ref="photoDialog" @verifyResult="getPopulationPhoto"></photo-dialog>
   <address-Dialog v-if="addressVisible" ref="addressDialog" @receiveParameters="getAddressParameters"></address-Dialog>
  </div>
</template>

<script>
import AddressDialog from '../dialog/addressDialog'
import { getDictList, getUnitMessage, getPhotoUrl, existIdCard } from "@/utils";
import { isMobile } from "@/utils/validate";
import ActuaunitDialog from "./actuaunitDialog";
import HouseDialog from "../dialog/houseDialogMore";
import idCardVerify from '../dialog/IDCardVerify'
import idCardVerifyCustody from '../dialog/IDCardVerifyCustody'
import photoDialog from '../dialog/photoDialog'
import Vue from "vue";
import { imgUrlHost } from '@/config/env'
import { clearTimeout } from 'timers';
export default {
  data() {
    // 严格的验证规则可以放到这里验证
    let checkCPhone = (rule, value, callback) => {
      if (value !== "") {
        if (isMobile(value)) {
          callback();
        } else {
          callback(new Error("手机格式不正确"));
        }
      } else {
        callback();
      }
    };
    let checkIdcard = (rule, value, callback) => {
      if (!this.validateIdCard(value)) {
        this.dataForm.sex = "";
        this.dataForm.birthdate = "";
        return callback(new Error("身份证号格式错误，请检查输入"));
      } else {
        existIdCard(value, this.dataForm.populationCoding).then(({ data }) => {
          if (data.count > 0) {
            return callback(new Error("身份证号码已经存在"));
          } else {
            this.dataForm.sex = this.getSexByIdCard(value);
            this.dataForm.birthdate = this.getBirthday(value);
            return callback();
          }
        });
      }
    };
    return {
      loading:false,
      activeName: 'first',
      visible: false,
      imgUrlHost: imgUrlHost,
      isAuthentication:true,
      isAuthenticationOwen:false,
      isInput: false,
      headers: {
        Authorization: "Bearer " + Vue.cookie.get("access-token")
        // Authorization: 'Bearer pp'
      },
      imageUrl:require("@/assets/img/idcard/idcard-default.png") ,// require('@/assets/img/photo1.png'),
      popuimageUrl: require("@/assets/img/idcard/snap-default.png"), // require('@/assets/img/photo1.png'),
      btnshow: true,
      houseVisible: false,
      addressVisible: false,
      dataForm: {
        populationCoding: "",
        managementCategory: "",
        identityNumber: "",
        name: "",
        usedName: "",
        identificationType: "111", // 证件种类默认选中身份证
        identificationNumber: "",
        foreignSurname: "",
        foreignName: "",
        sex: "",
        nation: "",
        birthdate: "",
        logoutCategory: "",
        relationIdentityNumber: "", // 监护人身份证
        relationName: "", // 监护人姓名
        relationPopulationId: '', // 监护人ID
        unitId: "",
        unitIdText: "",
        type: "",
        addressName: "",
        addressId: "",
        portraitId: "",
        addressText: '',
        portraitEntity: {
          photoUrl:'', // 照片存储文件服务器路径
          photoBase64:'', // 照片的base进制
          photo:'' //照片的二进制
        },
        house_populationList: {
          domains: [
            {
              houseId: "",
              addressName: "",
              dictValue: ""
            }
          ]
      },
      },
      peopleForm: {
        id: '',
        contactPhone: '',
        landlordName: '',
        landlordPhone: '',
        realName: '',
        maritalStatus: '',
        weddingDay: '',
        accountProperties: '',
        domicileAddress: '',
        healthCondition: '',
        educationDegree: '',
        isOnly: '',
        occupation: '',
        workUnit: '',
        isWithDoor: '',
        isPartyMember: '',
        isSubsistenceAllowance: '',
        isFocusGroups: '',
        isEndowmentInsurance: '',
        disabilityType: '',
        disabilityNumber: '',
        isNowMilitaryService: '',
        isEmptyNest: '',
        relatioTypeId: '1' // 认证类型默认为本人
      },
      option: '',
      accountPropertiesOptions: '',
      healthConditionOptions: '',
      educationDegreeOptions: '',
      yesOrNoOptions: '',
      occupationOptions: '',
      disabilityTypeOptions: '',
      authenticationTypes:'',
      dataFormValidate: false,
      peopleFormValidate: false,
      relationIdentityNumber: 'yy', // 监护人认证
      relationName: 'yy',
      dataRule: {
        // managementCategory: [
        //   {
        //     required: true,
        //     message: "实有人口管理类别不能为空",
        //     trigger: "blur"
        //   }
        // ],
        // identityNumber: [
        //   { validator: checkIdcard, required: true, trigger: "blur" }
        // ],
        name: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
        identificationType: [
          { required: true, message: "证件种类不能为空", trigger: "blur" }
        ],
        identificationNumber: [
          { required: true, message: "证件号码不能为空", trigger: "blur" }
        ],
        relationIdentityNumber: [
          { required: true, message: "监护人证件号不能为空", trigger: "blur" }
        ],
        relationName: [
          { required: true, message: "监护人姓名不能为空", trigger: "blur" }
        ],
        // houseName: [
        //   { required: true, message: '房屋不能为空', trigger: 'blur' }
        // ],
        // type: [
        //   { required: true, message: '人房关系不能为空', trigger: 'blur' }
        // ],
        unitIdText1: [
          { required: true, message: "单位不能为空", trigger: "blur" }
        ],
        // addressName: [
        //   { required: true, message: "房子名称不能为空", trigger: "blur" }
        // ],
        // house_populationListn_type:[
        //   { required: true, message: "人房关系不能为空", trigger: "blur" }
        // ],
        sex: [
          { required: true, message: '性别不能为空', trigger: 'blur' }
        ],
        nation: [
          { required: true, message: '民族不能为空', trigger: 'blur' }
        ],
        birthdate: [
          { required: true, message: '出生日期不能为空', trigger: 'blur' }
        ],
        // logoutCategory: [
        //   { required: true, message: '人口注销类别不能为空', trigger: 'blur' }
        // ],
        // unitIdText: [
        //   { required: true, message: '实有单位id不能为空', trigger: 'blur' }
        // ]
        // addressId: [
        //   { required: true, message: '标准地址id不能为空', trigger: 'blur' }
        // ],
        // portraitId: [
        //   { required: true, message: '标准人像id不能为空', trigger: 'blur' }
        // ]
        addressText: [
          { required: true, message: '请选择标准地址', trigger: 'blur' }
        ],
      },
      peopleRule: {
          contactPhone: [{ validator: checkCPhone, trigger: "blur" }]
      },
      nationOptions: [],
      sexOptions: [],
      zjlxOptions: [],
      options: [],
      rklbOptions: [],
      addOrUpdateVisible: false,
      rkzxlbOptions: [],
      houseAndPopulation: {
        houseId: "",
        addressName: "",
        dictValue: ""
      },
      reset_house_populationList: {
        domains: [
          {
            houseId: "",
            addressName: "",
            dictValue: ""
          }
        ]
      }
    };
  },
  components: {
    "actuaunit-Dialog": ActuaunitDialog,
    "house-Dialog": HouseDialog,
    "id-card-verify": idCardVerify,
    "id-card-verify-custody":idCardVerifyCustody,
    "photo-dialog" : photoDialog,
    "address-Dialog": AddressDialog
  },
  computed: {
    addressId() {
      return this.$store.state.address.id;
    }
  },
  created(){
    this.getPurpose()
    this.getAccountPropertiesType()
    this.getHealthCondition()
    this.getEducationDegree()
    this.getYesOrNo()
    this.getOccupationType()
    this.getDisabilityType()
    this.getAuthenticationType()
  },
  methods: {
    addressDialogOpen () {
        this.addressVisible = true
        this.$nextTick(() => {
          this.$refs.addressDialog.init()
        })
      },
    getAddressParameters ( data ) {
        this.dataForm.addressId = data.selectId
        this.dataForm.addressText = data.selectText
      },
    // 获取人员头像拍摄返回的信息
    getPopulationPhoto(data) {
      this.popuimageUrl = this.imgUrlHost + data
      this.peopleForm.avatar = data
    },
    // 附属表中人员头像的点击事件
    photoClick() {
      if(!this.isInput){
        if(this.peopleForm.relatioTypeId !== '1'){
          this.$refs.photoDialog.init ()
        }
      }
    },
    // 类型为 本人 时获取人证合一后返回的数据
    idCardRead (data) {
      if(data !== null){
        this.dataForm.birthdate = data.born.replace(/(.{4})(.{2})/, "$1-$2-")
        this.imageUrl = this.imgUrlHost  + data.idPhoto
        // this.dataForm.portraitId = data.idPhoto
        this.dataForm.portraitEntity.photoUrl = data.idPhoto
        this.dataForm.portraitEntity.photoBase64 = data.photobase64
        this.popuimageUrl = this.imgUrlHost + data.portraitPhoto
        this.peopleForm.avatar = data.portraitPhoto
        this.dataForm.name = data.name
        this.dataForm.identificationNumber = data.cardno
        if( data.sex === '男'){
          this.dataForm.sex = '1'
        } else {
          this.dataForm.sex = '2'
        }
        for(let i=0;i<this.nationOptions.length;i++){
          if(this.nationOptions[i].label === data.nation+'族'){
            this.dataForm.nation = this.nationOptions[i].value
            break
          }
        }
      }
      // this.nationOptions.forEach((val,index,val_arr)=>{
      //   if(val.label === data.nation+'族'){
      //     this.dataForm.nation = val.value
      //     return
      //   }
      //   console.log(index)
      // })
    },
    // 类型为 监护人 时获取验证信息
    idCardReadCustody (data) {
      if(data !== null){
         this.imageUrl = this.imgUrlHost  + data.idPhoto
        //  this.dataForm.portraitId = data.idPhoto
         this.dataForm.portraitEntity.photoUrl = data.idPhoto
         this.dataForm.portraitEntity.photoBase64 = data.photobase64
         this.dataForm.relationName = data.name
         this.dataForm.relationIdentityNumber = data.cardno
         this.dataForm.relationPopulationId = data.custodyId
         console.log(data.custodyId)
      }
    },
    // 初始化 本人  人证合一弹窗
    readIdcard () {
      this.$refs.idCardVerify.init ()
    },
     // 初始化 监护人  人证合一弹窗
    readIdcardCustody() {
      this.$refs.idCardVerifyCustody.init ()
    },
     // 监听选择类型的下拉列表的选择事件，根据选择的值更新页面
    authenticationChange(val) {
      this.imageUrl = require("@/assets/img/idcard/idcard-default.png") // require('@/assets/img/photo1.png'),
      this.popuimageUrl = require("@/assets/img/idcard/snap-default.png") // require('@/assets/img/photo1.png'),
      if(val == 1){
        this.isAuthentication = true
        this.isAuthenticationOwen = false
        this.zjlxOptions[0].disabled = false
        this.$nextTick(() => {
          this.$refs["dataForm"].resetFields();
          this.$refs["peopleForm"].resetFields();
          this.dataForm.identificationType = '111'
          this.relationIdentityNumber = ''
          this.relationName = ''
        })
      } else {
        this.isAuthentication = false
        this.isAuthenticationOwen = true
        this.zjlxOptions[0].disabled = true
        this.$nextTick(() => {
          this.$refs["dataForm"].resetFields();
          this.$refs["peopleForm"].resetFields();
          this.dataForm.identificationType = ''
          this.relationIdentityNumber = 'relationIdentityNumber'
          this.relationName = 'relationName'
        })
      }
    },
    handleClick(tab,event){

    },
    // 残疾类型字典数据
    getDisabilityType(){
      this.$http({
        url: 'dg-ic/ic/dict/type/disability_type',
        method: 'get'
        }).then(({data})=>{
            if(data && data.code === 0){
              this.disabilityTypeOptions = data.data
            }
        })
    },
    // 认证类型字典数据
    getAuthenticationType(){
      this.$http({
        url: 'dg-ic/ic/dict/type/authentication_type',
        method: 'get'
        }).then(({data})=>{
            if(data && data.code === 0){
              this.authenticationTypes = data.data
            }
        })
    },
    // 职业字典数据
    getOccupationType(){
      this.$http({
        url: 'dg-ic/ic/dict/type/occupation_type',
        method: 'get'
        }).then(({data})=>{
            if(data && data.code === 0){
              this.occupationOptions = data.data
            }
        })
    },
    // 是和否字典数据
    getYesOrNo(){
      this.$http({
        url: 'dg-ic/ic/dict/type/yes_or_no_status',
        method: 'get'
        }).then(({data})=>{
            if(data && data.code === 0){
              this.yesOrNoOptions = data.data
            }
        })
    },
    // 文化程度字典数据
    getEducationDegree(){
      this.$http({
        url: 'dg-ic/ic/dict/type/education_type',
        method: 'get'
        }).then(({data})=>{
            if(data && data.code === 0){
              this.educationDegreeOptions = data.data
            }
        })
    },
    // 是否健康字典数据
    getHealthCondition(){
      this.$http({
        url: 'dg-ic/ic/dict/type/health_status',
        method: 'get'
        }).then(({data})=>{
            if(data && data.code === 0){
              this.healthConditionOptions = data.data
            }
        })
    },
    // 户口性质残疾类型字典数据
    getAccountPropertiesType(){
      this.$http({
        url: 'dg-ic/ic/dict/type/account_properties_type',
        method: 'get'
        }).then(({data})=>{
            if(data && data.code === 0){
              this.accountPropertiesOptions = data.data
            }
        })
    },
    getPurpose(){
        this.$http({
        url: 'dg-ic/ic/dict/type/marital_status',
        method: 'get'
        }).then(({data})=>{
            if(data && data.code === 0){
              this.option = data.data
            }
        })
    },
    // 添加房屋选择输入框
    addDomain() {
      this.dataForm.house_populationList.domains.push({
        houseId: "",
        addressName: "",
        dictValue: ""
      });
    },
    // 移除一个房屋选择输入框
    removeDomain(item) {
      var index = this.dataForm.house_populationList.domains.indexOf(item);
      if (index !== 0) {
        this.dataForm.house_populationList.domains.splice(index, 1);
      }
    },
    // 重置输入框参数
    reset() {
      getDictList("type").then(({ data }) => {
        if (data && data.code === 0) {
          this.options = data.dictList;
        }
      });
      this.dataForm.house_populationList = JSON.parse(JSON.stringify(this.reset_house_populationList))
      this.dataForm.usedName = "";
      this.dataForm.foreignSurname = "";
      this.dataForm.foreignName = "";
      this.dataForm.sex = "";
      this.dataForm.nation = "";
      this.dataForm.birthdate = "";
      this.dataForm.logoutCategory = "";
      this.dataForm.unitId = "";
      this.dataForm.portraitId = "";
      // this.house_populationList = this.reset_house_populationList
      // console.log('1',this.reset_house_populationList)
    },
    // 初始化页面
    init(id, detail) {
      this.reset();
      this.btnshow = true;
      this.isInput = false;
      this.dataForm.populationCoding = id || 0;
      this.visible = true;
      if (detail) {
        this.btnshow = false;
        this.isInput = true;
        this.isAuthentication = true
        this.isAuthenticationOwen = true
      }
      this.$nextTick(() => {
        this.$refs["dataForm"].resetFields();
        this.$refs["peopleForm"].resetFields();
        this.imageUrl = require("@/assets/img/idcard/idcard-default.png") // require('@/assets/img/photo1.png'),
        this.popuimageUrl = require("@/assets/img/idcard/snap-default.png") // require('@/assets/img/photo1.png'),
        if (this.dataForm.populationCoding) {
          this.$http({
            // url: this.$http.adornUrl(`/dgactualpopulation/info/${this.dataForm.populationCoding}`),
            url: `/dg-standard-info/dgregisterpopulation/info/${this.dataForm.populationCoding}`,
            method: "get",
            params: this.$http.adornParams()
          }).then(({ data }) => {
            if (data && data.code === 0) {
              console.log('qin')
              this.dataForm.unitIdText = "";
              this.dataForm.managementCategory = data.dgRegisterPopulation.managementCategory;
              // this.dataForm.identityNumber =
              //   data.dgActualPopulation.identityNumber;
              this.dataForm.name = data.dgRegisterPopulation.name;
              this.dataForm.usedName = data.dgRegisterPopulation.usedName;
              this.dataForm.identificationType =
                data.dgRegisterPopulation.identificationType;
              this.dataForm.identificationNumber =
                data.dgRegisterPopulation.identificationNumber;
              this.dataForm.foreignSurname =
                data.dgRegisterPopulation.foreignSurname;
              this.dataForm.foreignName = data.dgRegisterPopulation.foreignName;
              this.dataForm.sex = data.dgRegisterPopulation.sex;
              this.dataForm.nation = data.dgRegisterPopulation.nation;
              this.dataForm.birthdate = data.dgRegisterPopulation.birthdate;
              this.dataForm.logoutCategory =
                data.dgRegisterPopulation.logoutCategory;
              if (data.dgRegisterPopulation.houseAdreessVo === null) {
                // this.house_populationList.domains = this.reset_house_populationList
              } else {
                this.dataForm.house_populationList.domains = data.dgRegisterPopulation.houseAdreessVo
              }
              // if (data.dgRegisterPopulation.unitEntity !== null) {
              //   this.dataForm.unitId = data.dgRegisterPopulation.unitEntity.unitCode;
              //   this.dataForm.unitIdText = data.dgRegisterPopulation.unitEntity.name;
              // }
              // getUnitMessage(data.dgActualPopulation.unitId).then(({data}) => {
              //   if(data.dgActualUnit){
              //     this.dataForm.unitIdText = data.dgActualUnit.name
              //   }
              // })
              // this.dataForm.addressId = data.dgActualPopulation.addressId
              if (data.dgRegisterPopulation.portraitEntity !== null) {
                this.dataForm.portraitId = data.dgRegisterPopulation.portraitEntity.id;
              }
              this.dataForm.portraitEntity = data.dgRegisterPopulation.portraitEntity
              console.log(this.dataForm.portraitEntity)
              this.imageUrl = this.getPhoto(data.dgRegisterPopulation.portraitEntity);
              // getPhotoUrl(data.dgActualPopulation.portraitId).then(({data}) => {
              //   if(data.dgBasicPortrait){
              //     this.imageUrl = data.dgBasicPortrait.photoUrl
              //   }
              // })
              this.dataForm.addressId = data.dgRegisterPopulation.addressId;
              this.dataForm.addressText = data.dgRegisterPopulation.addressName;
            }
          });
        }
      });
    },
    // 初始化附属表信息
    initPeople(id, detail){
      this.getSelectData()
      if(id){
        this.$http({
          url: `/dg-ic/ic/personnel-basic/info/${id}`,
          method: 'get',
          params: this.$http.adornParams()
        }).then(({data})=>{
          if(data && data.code === 0){
            if (data.icPersonnelBasicEntity !== null) {
              // this.peopleForm = data.data
              if(data.relationEntity !== null){
                // this.authenticationChange(data.relationEntity.relationTypeId)
                if (detail) {
                  this.isAuthentication = true
                  this.isAuthenticationOwen = true
                }else {
                  this.isAuthentication = false
                  this.isAuthenticationOwen = true
                }
                this.zjlxOptions[0].disabled = true
                this.$nextTick(() => {
                  // this.$refs["dataForm"].resetFields();
                  // this.$refs["peopleForm"].resetFields();
                  // this.dataForm.identificationType = ''
                  this.relationIdentityNumber = 'relationIdentityNumber'
                  this.relationName = 'relationName'
                })
                this.peopleForm.relatioTypeId = data.relationEntity.relationTypeId+''
                this.dataForm.relationIdentityNumber = data.relationEntity.populationVo.identificationNumber
                this.dataForm.relationPopulationId = data.relationEntity.relationDgActualPopulationId
                this.dataForm.relationName = data.relationEntity.populationVo.name
              }else {
                this.isAuthentication = true
                if (detail) {
                  this.isAuthenticationOwen = true
                }else {
                  this.isAuthenticationOwen = false
                }
                this.relationIdentityNumber = ''
                this.peopleForm.relatioTypeId = '1'
                this.relationName = ''
              }
              this.peopleForm.id = data.icPersonnelBasicEntity.id
              this.peopleForm.contactPhone = data.icPersonnelBasicEntity.contactPhone
              this.peopleForm.landlordName = data.icPersonnelBasicEntity.landlordName
              this.popuimageUrl = this.imgUrlHost + data.icPersonnelBasicEntity.avatar
              this.peopleForm.landlordPhone = data.icPersonnelBasicEntity.landlordPhone
              this.peopleForm.realName = data.icPersonnelBasicEntity.realName
              this.peopleForm.maritalStatus = data.icPersonnelBasicEntity.maritalStatus == null ? '':data.icPersonnelBasicEntity.maritalStatus+""
              this.peopleForm.weddingDay = data.icPersonnelBasicEntity.weddingDay
              this.peopleForm.accountProperties = data.icPersonnelBasicEntity.accountProperties == null ? '':data.icPersonnelBasicEntity.accountProperties+""
              this.peopleForm.domicileAddress = data.icPersonnelBasicEntity.domicileAddress
              this.peopleForm.healthCondition = data.icPersonnelBasicEntity.healthCondition == null ? '':data.icPersonnelBasicEntity.healthCondition+""
              this.peopleForm.educationDegree = data.icPersonnelBasicEntity.educationDegree == null ? '':data.icPersonnelBasicEntity.educationDegree+""
              this.peopleForm.isOnly = data.icPersonnelBasicEntity.isOnly == null ? '':data.icPersonnelBasicEntity.isOnly+""
              this.peopleForm.occupation = data.icPersonnelBasicEntity.occupation == null ? '':data.icPersonnelBasicEntity.occupation+""
              this.peopleForm.workUnit = data.icPersonnelBasicEntity.workUnit == null ? '':data.icPersonnelBasicEntity.workUnit+""
              this.peopleForm.isWithDoor = data.icPersonnelBasicEntity.isWithDoor == null ? '':data.icPersonnelBasicEntity.isWithDoor+""
              this.peopleForm.isPartyMember = data.icPersonnelBasicEntity.isPartyMember == null ? '':data.icPersonnelBasicEntity.isPartyMember+""
              this.peopleForm.isSubsistenceAllowance = data.icPersonnelBasicEntity.isSubsistenceAllowance == null ? '':data.icPersonnelBasicEntity.isSubsistenceAllowance+""
              this.peopleForm.isFocusGroups = data.icPersonnelBasicEntity.isFocusGroups == null ? '':data.icPersonnelBasicEntity.isFocusGroups+""
              this.peopleForm.isEndowmentInsurance = data.icPersonnelBasicEntity.isEndowmentInsurance == null ? '':data.icPersonnelBasicEntity.isEndowmentInsurance+""
              this.peopleForm.disabilityType = data.icPersonnelBasicEntity.disabilityType == null ? '':data.icPersonnelBasicEntity.disabilityType+""
              this.peopleForm.disabilityNumber = data.icPersonnelBasicEntity.disabilityNumber == null ? '':data.icPersonnelBasicEntity.disabilityNumber+""
              this.peopleForm.isNowMilitaryService = data.icPersonnelBasicEntity.isNowMilitaryService == null ? '':data.icPersonnelBasicEntity.isNowMilitaryService+""
              this.peopleForm.isEmptyNest = data.icPersonnelBasicEntity.isEmptyNest == null ? '':data.icPersonnelBasicEntity.isEmptyNest+""
            }
          }
        })
      }
    },
    // 获取照片信息
    getPhoto(data) {
      let photo = "";
      if (data === null) {
        photo = "../../../static/img/photo.png";
      } else {
        if (data.photoUrl !== null) {
          photo = this.imgUrlHost  + data.photoUrl;
        } else if (data.photoBase64 !== null) {
          photo = "data:image/png;base64," + data.photoBase64;
        } else {
          photo = "../../../static/img/photo.png";
        }
      }
      return photo;
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs["dataForm"].validate(valid => {
        if (valid) {
          this.dataFormValidate = true
        }
      });
      this.$refs[`peopleForm`].validate(valid1=>{
        if(valid1){
          this.peopleFormValidate = true
        }
      })
      if(this.dataFormValidate && this.peopleFormValidate){
        this.houseAndPopulation.type = this.dataForm.type;
        this.loading = true
          this.$http({
            url: `/dg-ic/ic/personnel-basic/insertOrUpdate`,
            method: "post",
            data: this.$http.adornData({
              populationCoding: this.dataForm.populationCoding || undefined,
              managementCategory: this.dataForm.managementCategory,
              identityNumber: this.dataForm.identityNumber,
              name: this.dataForm.name,
              usedName: this.dataForm.usedName,
              identificationType: this.dataForm.identificationType,
              identificationNumber: this.dataForm.identificationNumber,
              foreignSurname: this.dataForm.foreignSurname,
              foreignName: this.dataForm.foreignName,
              sex: this.dataForm.sex,
              nation: this.dataForm.nation,
              birthdate: this.dataForm.birthdate,
              logoutCategory: this.dataForm.logoutCategory,
              unitId: this.dataForm.unitId,
              portraitEntity: this.dataForm.portraitEntity,
              addressId: this.dataForm.addressId,
              houseAndPopulation: this.dataForm.house_populationList.domains,
              portraitId: this.dataForm.portraitId,
              sysCreateBy: this.$store.state.user.id,
              sysUpdateBy: this.$store.state.user.id,
              id: this.peopleForm.id,
              // 附表信息
              'contactPhone': this.peopleForm.contactPhone,
              'landlordName': this.peopleForm.landlordName,
              'landlordPhone': this.peopleForm.landlordPhone,
              'realName': this.dataForm.name,
              'maritalStatus': this.peopleForm.maritalStatus,
              'weddingDay' : this.peopleForm.weddingDay,
              'accountProperties': this.peopleForm.accountProperties,
              'domicileAddress': this.peopleForm.domicileAddress,
              'healthCondition': this.peopleForm.healthCondition,
              'educationDegree': this.peopleForm.educationDegree,
              'avatar': this.peopleForm.avatar,
              'isOnly': this.peopleForm.isOnly,
              'occupation': this.peopleForm.occupation,
              'workUnit': this.peopleForm.workUnit,
              'isWithDoor': this.peopleForm.isWithDoor,
              'isPartyMember': this.peopleForm.isPartyMember,
              'isSubsistenceAllowance': this.peopleForm.isSubsistenceAllowance,
              'isFocusGroups': this.peopleForm.isFocusGroups,
              'isEndowmentInsurance': this.peopleForm.isEndowmentInsurance,
              'disabilityType': this.peopleForm.disabilityType,
              'disabilityNumber': this.peopleForm.disabilityNumber,
              'isNowMilitaryService': this.peopleForm.isNowMilitaryService,
              'isEmptyNest': this.peopleForm.isEmptyNest,
              'relation_type_id':parseInt(this.peopleForm.relatioTypeId),
              'relationPopulationId':this.dataForm.relationPopulationId
            })
          }).then(({ data }) => {
            if (data && data.code === 0) {
              this.$message({
                message: "操作成功",
                type: "success",
                duration: 1500,
                onClose: () => {
                  this.loading = false
                  this.visible = false;
                  this.$emit("refreshDataList");
                  this.dataFormValidate = false;
                  this.peopleFormValidate = false;
                }
              });
            } else {
              this.$message.error(data.msg);
               this.loading = false
            }
          });
      }
    },
    // 单位选择按钮点击事件
    buttonHandle() {
      this.addOrUpdateVisible = true;
      this.$nextTick(() => {
        this.$refs.actuaunitDialog.init();
      });
    },
    // 房屋选择按钮点击事件
    buttonHouseHandle(index, houseId) {
      this.houseVisible = true;
      this.$nextTick(() => {
        this.$refs.houseDialog.init(index, houseId);
      });
    },
    // 获取单位弹框返回数据
    getParameters(data) {
      this.dataForm.unitId = data.selectId;
      this.dataForm.unitIdText = data.selectText;
    },
    // 获取房屋弹框返回数据
    getHouseParameters(data, index) {
      // this.houseAndPopulation.houseId = data.selectId
      // this.houseAndPopulation.houseName = data.selectText
      // this.dataForm.houseName = data.selectText
      this.dataForm.house_populationList.domains[index].houseId = data.selectId;
      this.dataForm.house_populationList.domains[index].addressName = data.selectText;
    },
    // 获取数据字典的数据
    getSelectData() {
      getDictList("nation").then(({ data }) => {
        this.nationOptions = data.dictList;
      });
      getDictList("sex").then(({ data }) => {
        this.sexOptions = data.dictList;
      });
      getDictList("type_document").then(({ data }) => {
        this.zjlxOptions = data.dictList;
      });
      getDictList("population_type").then(({ data }) => {
        this.rklbOptions = data.dictList;
      });
      getDictList("population_cancellation_type").then(({ data }) => {
        this.rkzxlbOptions = data.dictList;
      });
    },
    // 通过身份证获取生日
    getBirthday(idCard) {
      let birthday = "";
      if (idCard !== null && idCard !== "") {
        if (idCard.length === 15) {
          birthday = "19" + idCard.substr(6, 6);
        } else if (idCard.length === 18) {
          birthday = idCard.substr(6, 8);
        }
        birthday = birthday.replace(/(.{4})(.{2})/, "$1-$2-");
      }
      return birthday;
    },
    // 通过身份证获取性别
    getSexByIdCard(idCard) {
      if (parseInt(idCard.substr(16, 1)) % 2 === 1) {
        // 男
        return "1";
      } else {
        // 女
        return "2";
      }
    },
    inputBlur() {
      if (this.validateIdCard(this.dataForm.identityNumber)) {
        this.dataForm.sex = this.getSexByIdCard(this.dataForm.identityNumber);
        this.dataForm.birthdate = this.getBirthday(
          this.dataForm.identityNumber
        );
      } else {
      }
    },
    // 验证身份证信息是否正确
    validateIdCard(id, backInfo) {
      let info = {
        y: "1900",
        m: "01",
        d: "01",
        sex: "male",
        valid: false,
        length: 0
      };
      if (typeof id !== "string") return this.back(info, backInfo);
      // 18
      if (/^\d{17}[0-9x]$/i.test(id)) {
        if (!this.initDate(18, info, id)) return this.back(info, backInfo);
        id = id.toLowerCase().split("");
        let wi = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
        let y = "10x98765432".split("");
        let sum = 0;
        for (let i = 0; i < 17; i++) sum += wi[i] * id[i];
        if (y[sum % 11] === id.pop().toLowerCase()) info.valid = true;
        return this.back(info, backInfo);
      } else if (/^\d{15}$/.test(id)) {
        // 15
        if (this.initDate(15, info, id)) info.valid = true;
        return this.back(info, backInfo);
      } else {
        return this.back(info, backInfo);
      }
    },
    back(info, backInfo) {
      return backInfo ? info : info.valid;
    },
    initDate(length, info, id) {
      info.length = length;
      let a;
      a = length === 15 ? 0 : 2; // 15:18
      let temp;
      info.y = (a ? "" : "19") + id.substring(6, 8 + a);
      info.m = id.substring(8 + a, 10 + a);
      info.d = id.substring(10 + a, 12 + a);
      info.sex = id.substring(14, 15 + a) % 2 === 0 ? "female" : "male";
      temp = new Date(info.y, info.m - 1, info.d);
      return (
        temp.getFullYear() === info.y * 1 &&
        temp.getMonth() + 1 === info.m * 1 &&
        temp.getDate() === info.d * 1
      );
    },
    // 文件上传成功时调用
    handleSucess(response, file, fileList) {
      this.$message({
        message: "文件上传成功",
        type: "success",
        duration: 1500,
        onClose: () => {
          this.imageUrl = this.imgUrlHost + response.iconName;
          this.dataForm.portraitId = response.iconName;
          // this.picJson.url = this.dataForm.picUrl
          // this.fileList[0] = this.picJson
        }
      });
    },
    // 文件上传失败时调用
    handleError(file, fileList) {
      this.$message.error("文件上传失败");
    },
    beforeAvatarUpload(file) {
      const isJPG = file.type === "image/jpeg";
      const isPNG = file.type === "image/png";
      const isLt2M = file.size / 1024 / 1024 < 2;
      let fileFlag = false;
      if (isJPG || isPNG) {
        fileFlag = true;
      } else {
        this.$message.error("上传头像图片只能是 JPG 格式或 PNG 格式!");
      }
      if (!isLt2M) {
        this.$message.error("上传头像图片大小不能超过 2MB!");
      }
      // * ***************************
      // const isSize = new Promise(function (resolve, reject) {
      //   let width = 500 // 限制图片尺寸为654X270
      //   let height = 500
      //   let _URL = window.URL || window.webkitURL
      //   let img = new Image()
      //   img.onload = function () {
      //     let valid = img.width === width && img.height === height
      //     valid ? resolve() : reject(new Error(0))
      //   }
      //   img.src = _URL.createObjectURL(file)
      // }).then(() => {
      //   return file
      // }, () => {
      //   this.$message.error('图片尺寸限制为500 x 500')
      //   return Promise.reject(new Error(0))
      // })
      return fileFlag && isLt2M; // && isSize
    }
  }
};
</script>

<style>
.el-input.is-disabled .el-input__inner {
  color: #606266;
}
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 64px;
  height: 64px;
  text-align: center;
}
.avatar {
  width: 64px;
  height: 64px;
  display: block;
}
.custom-3E8EF7 .el-form-item.is-required .el-form-item__label:before {
  font-size: 22px;
}
.custom-3E8EF7 .el-input.is-disabled .el-input__inner {
  color: #00000088;
}
</style>

